<template>
  <div>
    <el-form ref="form" >
      <el-form-item>
        <el-input placeholder="用户名" style="width:200px;margin-right:10px"></el-input>
        <el-button type="primary" icon="el-icon-search">查询</el-button>
        <el-button>清空</el-button>
      </el-form-item>
      <el-form-item>
        <el-button type="primary">添加</el-button>
        <el-button type="danger">批量删除</el-button>
      </el-form-item>
      <el-form-item>
        <el-table
          :data=[]
          border
          style="width: 100%">
          <el-table-column
            type="selection"
            width="width">
          </el-table-column>
           <el-table-column
            type="index"
            label="序号"
            align="center"
            width="100">
          </el-table-column>
          <el-table-column
            label="用户名"
            width="width">
          </el-table-column>
           <el-table-column
            label="用户昵称"
            width="width">
          </el-table-column>
           <el-table-column
            label="角色列表"
            width="width">
          </el-table-column>
           <el-table-column
            label="创建时间"
            width="width">
          </el-table-column>
           <el-table-column
            label="更新时间"
            width="width">
          </el-table-column>
          <el-table-column
            label="操作"
            width="width">
            <Hintbutton title="分配角色" type='info' icon='el-icon-user'></Hintbutton>
            <Hintbutton title="修改用户" type='primary' icon='el-icon-edit'></Hintbutton>
            <Hintbutton title="删除用户" type='danger' icon='el-icon-delete'></Hintbutton>
          </el-table-column>
        </el-table>
        <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        background
        style="margin-top:10px"
        align='center'
        :current-page.sync="currentPage"
        :page-sizes="[5, 7, 9]"
        :page-size="limit"
        layout="prev, pager, next, jumper, ->, sizes, total"
        :total="total">
    </el-pagination>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {
    };
  },
  computed: {},
  methods: {},
  mounted() {}
};
</script>
<style scoped>
</style>